<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="../js/jquery-3.3.1.min.js" ></script>
		<script>
			$(function(){
				$("form#regForm").submit(function(){
					var e=$(":text[name='nickname']").val();
					if(e.length<4||e.length>16){
						alert("昵称长度必须在1-16之间，您输入的是"+e.length);
						return false;
					}
					//要求不能有数字
					for(var i=0;i<e.length;i++){
						if(e.charAt(i)>='0'&&e.charAt(i)<='9'){
							alert("昵称中不能有数字");
							return false;
						}
					}
					
					
					var age=$("#age").val();
					if(isNaN(age)){
						alert("年龄不是数字");
						return false;
					}
					if(age<14||age>60){
						alert("年龄必须在14-60之间");
						return false;
					}
					return true;
				});
				
				function checkName(e){
					if($(this).val().length<4||$(this).val().length>16){
						alert("昵称长度必须在1-16之间，您输入的是"+$(this).val().length);
						return false;
					}
					return true;
				}
				$(":text[name='nickname']").blur(checkName);
				
//				$(":text[name='nickname']").blur(function(){
//					//this,4-16
//					if($(this).val().length<4||$(this).val().length>16){
//						alert("昵称长度必须在1-16之间，您输入的是"+$(this).val().length);
//						return false;
//					}
//				});
				$("input#email").blur(function(){
					var e=$(this).val();
					if(e.indexOf("@")>0&&e.indexOf(".")>0){
						alert("合法");
					}else{
						alert("非法的邮件格式");
					}
				});
			});
		</script>
	</head>
	<body>
		<form action="index1.html" method="get" id="regForm">
			<h1>表单验证</h1>
			<p>
				<label>昵称</label><input type="text" name="nickname" />
			</p>
			<p>
				输入密码:<input name="pass" type="password" id="pwd" class="inputs" />
			</p>
			<p>
				
			再次输入密码:<input type="password" id="repass" name="repass"/>
			</p>
			<p>
				您的Email:<input type="email" name="email" class="inputs" id="email"/><br />
			
			</p>
			<p>
				<label>手机号</label>
				<input type="tel" name="telephone" />
			</p>
			<p>
				<label>年龄</label>
				<input type="text" name="age" id="age"/>
			</p>
			
			<input type="submit" value="注册" name="btn" class="rbl"/>
		</form>
	</body>
</html>
